@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
    .flex-a {
        @apply flex justify-around;
    }
    .flex-a-c {
        @apply flex items-center justify-around;
    }
    .flex-b {
        @apply flex justify-between;
    }
    .flex-b-c {
        @apply flex items-center justify-between;
    }
    .flex-c {
        @apply flex items-center;
    }
    .flex-c-c {
        @apply flex items-center justify-center;
    }
    .flex-e {
        @apply flex justify-evenly;
    }
    .flex-e-c {
        @apply flex items-center justify-evenly;
    }
    .flex-col-a {
        @apply flex flex-col justify-around;
    }
    .flex-col-a-c {
        @apply flex flex-col items-center justify-around;
    }
    .flex-col-b {
        @apply flex flex-col justify-between;
    }
    .flex-col-b-c {
        @apply flex flex-col items-center justify-between;
    }
    .flex-col-c {
        @apply flex flex-col items-center;
    }
    .flex-col-c-c {
        @apply flex flex-col items-center justify-center;
    }
    .flex-col-e {
        @apply flex flex-col justify-evenly;
    }
    .flex-col-e-c {
        @apply flex flex-col items-center justify-evenly;
    }
    /* 变换过渡 */
    .trans {    
        @apply transition duration-300;
    }
}